<template>
    <span>
        <template  v-if="action == 'edit'">
            <el-input-number v-on="$listeners" :value="value" :precision="2" :step="0.1"  placeholder="请输入数字"></el-input-number>
        </template>
        <template  v-if="action == 'search' ">

            <span class="number_range el-input__inner">
                 <el-input
                         v-model="min"
                         placeholder="最小值"
                 >
                 </el-input>
                -
                 <el-input
                         v-model="max"
                         placeholder="最大值"
                 >
                 </el-input>
            </span>

        </template>
        <template  v-if="action == 'table'">
            {{value}}
        </template>
    </span>
</template>
<script>
    import base from './base.js';
    export default {
        extends:base,
        props: {
        },
        data() {
            return {
                max:null,
                min:null,
                searchModel:'range',
            }
        },
        computed:{
            rangeValue:function(){
                return [this.min,this.max];
            }
        },
        watch:{
            value:function(newValue){
                if(typeof newValue == 'object'){
                    this.min=newValue[0];
                    this.max=newValue[1];
                }else{
                    this.min='';
                    this.max='';
                }

            },
            rangeValue:function () {
                this.$emit('input',this.rangeValue);
            }
        }

    }
</script>
<style>
    .number_range{
        border: 1px solid #dcdfe6;
        height:42px;
        display: inline-block;
    }
    .number_range .el-input{
        width:45%;
    }
    .number_range input{
        text-align: center;
        padding: 0px 5px;
        border-radius:4px;
        display: inline;
        border: none !important;
    }
</style>